<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8" />
	<title>HTML5 Media with Fallback Flash Player: Audio</title>	
	
	<!-- These files are required to use MediaElement.js for audio or video with a Flash fallback -->
	<script src="build/jquery.js"></script>	
	<script src="build/mediaelement-and-player.min.js"></script>
	<link rel="stylesheet" href="build/mediaelementplayer.min.css" />

	<style>
	/* NOTE: I recommend putting your styles in an external style sheet. I embedded this CSS to simplify the example. These styles don't affect the appearance of the audio player, just the text around it. */
	body { font-family: sans-serif; }

	h1 {
		border-bottom: 1px solid #000;
		font-size: 1.5em;
	}

	p {
		line-height: 1.4;
	}

	</style>
</head>
<body>
<h1>Audio Player with MediaElementPlayer.js Fallback</h1>

<audio controls>
	<source src="piano.ogg" type="audio/ogg">
	<source src="piano.mp3" type="audio/mp3">
	<p>Your browser doesn't support HTML5 audio or Flash, but you can <a href="piano.mp3">download the audio file</a> (MP3, 1.3 MB).</p>
</audio>

<script>
$('audio').mediaelementplayer();
</script>
</body>
</html>
